<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <%@ include file="/static/m/jsp/include.jsp"%>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,user-scalable=no, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>梦可梦分享</title>
    <script src="${path}/static/m/js/lib/md5.js"></script>
    <link rel="stylesheet" href="${path}/static/m/style/share.css">
    <script type="javascript">
        //邀请人
        var inviteId = '${inviteId}';

    </script>
    <script>
        var wait=60;
        function getCount(target){
            if(wait==0){
                target.removeAttribute('disabled',true);
                target.value="获取验证码";
                wait=60;
                model.sendEnable = true;
            }else{
                target.setAttribute('disabled',false);
                target.value=wait+'s';
                wait--;
                setTimeout(function(){
                    getCount(target)
                },1000)
            }

        }
        $(function () {
            var app = new Vue({
                el:'#regist',
                data:{
                    sendEnable:true,
                    user:{
                        account:'',
                        code:'',
                        password:'',
                        pwd:''
                    }
                },
                methods:{
                    getCode:function (e) {
                        var that = this;
                        if (that.sendEnable){
                            if(!UT.isPhone(that.user.account)){
                                sy.msg("请输入正确的手机号");
                                return;
                            }
                            $.post(sy.path + "/api/account/getMobileMsg",{phone:that.user.account,type:1},function (data) {
                                sy.closeLoad();
                                if(data.errorCode == 0){
                                    that.sendEnable = false;
                                    that.user.code = data.data.code;
                                    getCount(e.target);
                                }else{
                                    sy.alert(data.errorMsg);
                                }
                            })
                        }
                    },
                    regist:function () {
                        var that = this;
                        if(!UT.isPhone(that.user.account)){
                            sy.msg("请输入正确的手机号");
                            return;
                        }
                        if (!that.user.code){
                            sy.msg("请输入短信验证码");
                            return;
                        }
                        if (!that.user.password){
                            sy.msg("请输入密码");
                            return;
                        }
                        if (that.user.password != that.user.pwd){
                            sy.msg('两次密码不一样!');
                            return;
                        }
                        var data = {
                            'phone':that.user.account,
                            'code':that.user.code,
                            'password':hex_md5(that.user.password),
                            'deviceType':0
                        };
                        $.post(sy.path + "/api/account/regist",data,function (data) {
                            sy.closeLoad();
                            if(data.errorCode == 0){
                                sy.alert('注册成功',function () {
                                    location.reload()
                                });
                            }else{
                                sy.alert(data.errorMsg);
                            }
                        })
                    }
                }
            })
        })
    </script>
</head>
<body style="background-image:url(${path}/static/m/images/sign_bg.jpg); width:100%; background-size: cover; background-repeat:no-repeat;">
    <div class="share_box">
        <h2 class="sign_head">注册</h2>
        
        <div class="sign_form" id="regist">
            <form>
                <div class="form_item">
                    <span class="label_name">账号</span>
                    <input class="item" type="number" v-model="user.account" placeholder="请输入手机号"/>
                </div> 
                <div class="form_item">
                    <span class="label_name">验证码</span>
                    <input class="item code" type="number" v-model="user.code" placeholder="请输入验证码"/>
                    <input id="code" class="get_code" v-on:click="getCode" type="button" value="获取验证码">
                </div> 
                <h3 class="item_title">密码设置</h3>
                <div class="form_item">
                    <span class="label_name">密码</span>
                    <input class="item" type="password" v-model="user.password" placeholder="请输入新密码"/>
                </div> 
                <div class="form_item">
                    <span class="label_name">重复密码</span>
                    <input class="item" type="password" v-model="user.pwd" placeholder="请再次输入新密码"/>
                </div> 
            </form>
            <div class="sign_agree">
                <img class="checkbox" src="${path}/static/m/images/checkbox.png"/>
                <span>同意<a href="${path}/singlePage/regist">梦可梦用户注册协议</a></span>
            </div>
            <a class="sign_btn" href="javascript:void(0)" v-on:click="regist()"><img src="${path}/static/m/images/sign_btn.png"></a>
        </div>
    </div>

</body>
</html>